<template>
	<ul>
		<li v-for = "(item,index) of list" :key = "index" class = "border-bottom">
			<span></span>
			{{item.title}}
			<detail-list :list = "item.children" class = "item.children" v-if = "item.children"></detail-list>
		</li>
	</ul>
</template>

<script>
	export default {
		name : 'detailList',
		props:["list"]
	}
</script>

<style scoped lang = "less">
	ul {
		li {
			line-height: .8rem;
		    font-size: .32rem;
		    padding: 0 .2rem;
			span{
				position: relative;
			    left: .06rem;
			    top: .06rem;
			    display: inline-block;
			    width: .36rem;
			    height: .36rem;
			    background: url(http://s.qunarzz.com/piao/image/touch/sight/detail.png) 0 -.45rem no-repeat;
			    margin-right: .1rem;
			    background-size: .4rem 3rem;
			}
			.item.children {
				li {
					padding: 0 .2rem
				}
			}
		}
	}
</style>